<!-- Add jQuery library -->
<script src='https://dsa-site-files.googlecode.com/svn/trunk/DSA/jquery.min.js' type='text/javascript'></script>
<!-- Add fancyBox -->
<link href='https://dsa-site-files.googlecode.com/svn/trunk/DSA/jquery.fancybox_original.css' media='screen' rel='stylesheet' type='text/css'></link>
<script src='https://dsa-site-files.googlecode.com/svn/trunk/DSA/jquery.fancybox.pack.js?v=2.1.5' type='text/javascript'></script>
<!-- Add fancyBox mousewheel-->
<script src='https://dsa-site-files.googlecode.com/svn/trunk/DSA/jquery.mousewheel-3.0.6.pack.js' type='text/javascript'></script>
<!-- Add fancyBox-Thumbs -->
<link href='https://dsa-site-files.googlecode.com/svn/trunk/DSA/jquery.fancybox-thumbs.css?v=1.0.7' media='screen' rel='stylesheet' type='text/css'></link>
<script src='https://dsa-site-files.googlecode.com/svn/trunk/DSA/jquery.fancybox-thumbs.js?v=1.0.7' type='text/javascript'></script>
<!-- FancyBox Start-->
<script src='https://dsa-site-files.googlecode.com/svn/trunk/DSA/fancy_init.js' type='text/javascript'></script>


<link href="https://dsa-site-files.googlecode.com/svn/trunk/DSA/tsc_datagrid.css" rel="stylesheet"></link>
<script src="https://dsa-site-files.googlecode.com/svn/trunk/DSA/tsc_datagrid.js" type="text/javascript"></script>



<!-- DC DataGrid Start -->
<div id="tsort-tablewrapper" style="width: 100%;">
<div id="tsort-tableheader">
<div class="tsort-search">
<select id="tsort-columns" onchange="sorter.search('query')">       </select>
<input id="query" onkeyup="sorter.search('query')" type="text" />
</div>
<span class="tsort-details">
</span>
<div>
<span class="tsort-details">Records <span id="tsort-startrecord"></span>-<span id="tsort-endrecord"></span> of <span id="tsort-totalrecords"></span></span></div>
<span class="tsort-details">    </span>
<div>
<span class="tsort-details"><a href="javascript:sorter.reset()">reset</a></span>


</div>
</div>

<table border="0" cellspacing="10" class="tinytable" id="tsctablesort1"><thead>
<tr> <th><h3 id="col1">
ID</h3>
</th>  <th><h3 id="col2">
MASTERPIECE</h3>
</th>         <th><h3 id="col3">
ORIGIN</h3>
</th>  <th><h3 id="col4">
COLOR</h3>
</th> </tr>
</thead>            <tbody>
<tr><td>749</td><td><a class="fancybox-thumbs" rel="grid749" id="imglink" href="http://farm9.staticflickr.com/8405/8607413940_f04f91f2c5_b.jpg" title="BEOBAR - 2013" onClick="_gaq.push(['_trackEvent', 'grid', 'click', '749 BEOBAR']);">BEOBAR</a></td><td>2013-03-31</td><td>GREEN</td></tr>
<tr><td>748</td><td><a class="fancybox-thumbs" rel="grid748" id="imglink" href="http://farm9.staticflickr.com/8265/8606311123_ec8ef8346c_b.jpg" title="COMIC FIELD - 2013" onClick="_gaq.push(['_trackEvent', 'grid', 'click', '748 COMIC FIELD']);">COMIC FIELD</a></td><td>2013-03-31</td><td>ORANGE</td></tr>
<tr><td>747</td><td><a class="fancybox-thumbs" rel="grid747" id="imglink" href="http://farm9.staticflickr.com/8384/8606293833_4147fdcf40_b.jpg" title="DIVA PEOPLE 2 - 2013" onClick="_gaq.push(['_trackEvent', 'grid', 'click', '747 DIVA PEOPLE 2']);">DIVA PEOPLE 2</a></td><td>2013-03-31</td><td>RED</td></tr>



</tbody>    </table>




<div id="tsort-tablefooter">
<div id="tsort-tablenav">
<div>
<img alt="START" height="16" onclick="sorter.move(-1,true)" src="dreamcodes/datagrid/images/first.gif" width="16" /> <img alt="PREVIOUS" height="16" onclick="sorter.move(-1)" src="dreamcodes/datagrid/images/previous.gif" width="16" /> <img alt="NEXT" height="16" onclick="sorter.move(1)" src="dreamcodes/datagrid/images/next.gif" width="16" /> <img alt="END" height="16" onclick="sorter.move(1,true)" src="dreamcodes/datagrid/images/last.gif" width="16" /> </div>
<div>
<select id="tsort-pagedropdown">         </select></div>
<div>
<a href="javascript:sorter.showall()">view all</a> </div>
</div>
<div id="tsort-tablelocation">
<div>
<select onchange="sorter.size(this.value)">           <option value="5">5</option>           <option selected="selected" value="10">10</option>           <option value="20">20</option>           <option value="50">50</option>           <option value="100">100</option>         </select>
Entries Per Page </div>
<div class="tsort-page">
Page <span id="tsort-currentpage"></span> of <span id="tsort-totalpages"></span></div>
</div>
</div>
</div>
<!-- DC DataGrid Settings -->
<script type="text/javascript">    var sorter = new TINY.table.sorter('sorter','tsctablesort1',{         headclass:'head',         ascclass:'asc',         descclass:'desc',         evenclass:'tsort-evenrow',         oddclass:'tsort-oddrow',         evenselclass:'tsort-evenselected',         oddselclass:'tsort-oddselected',         paginate:true, // pagination (true,false)         size:10, // show 10 results per page         colddid:'tsort-columns',         currentid:'tsort-currentpage',         totalid:'tsort-totalpages',         startingrecid:'tsort-startrecord',         endingrecid:'tsort-endrecord',         totalrecid:'tsort-totalrecords',         hoverid:'tsort-selectedrow',         pageddid:'tsort-pagedropdown',         navid:'tsort-tablenav',         sortcolumn:1, // sort column 1         sortdir:1, // sort direction         columns:[{index:6, format:'%', decimals:1},{index:7, format:'$', decimals:0}], // classify for proper sorting         init:true // activate datagrid (true,false)     });   </script>
<!-- DC DataGrid End -->
<div class="tsc_clear">
</div>
<!-- line break/clear line -->





